<template>
<div :class="[$style.container]">
  <input type="file" hidden v-bind="params" @change="onChange" ref="file">
</div>
</template>

<script lang="ts">

import { existsName, upload } from '@/api/doc'
import { FileData, UploadParams, UploadResp } from '@/plugins/oss/src/Oss'
import FileUploadMixins from '@/mixins/file-upload-mixins'
import { mixins } from 'vue-class-component'
import { Vue, Component, Prop, Emit, Inject, Ref } from 'vue-property-decorator'

@Component
export default class OssUpload extends mixins(FileUploadMixins) {
  @Ref() file!: HTMLInputElement

  @Inject() load!: () => void

  @Inject() uploadConfirm!: (files: FileList, parentId: number) => Promise<boolean>

  params: any = {}

  parent: any = null

  open (params: any, parent: any) {
    this.params = params || {}
    this.parent = parent || null
    this.file.value = ''
    this.$nextTick(() => {
      this.file.click()
    })
  }

  async onChange (value: any) {
    if (await this.uploadConfirm(this.file.files as FileList, this.parent?.id)) {
      const files = this.file.files as FileList
      this.uploadFiles(files, this.parent, this.load)
    }
  }

  // onChange (value: any) {
  //   const files = this.file.files as FileList
  //   for (let i = 0; i < files?.length; i++) {
  //     const item = files[i]
  //     const params: UploadParams = {
  //       name: item.name,
  //       file: item,
  //       path: this.parent?.path,
  //       parentId: this.parent?.id,
  //       beforeUpload: (params: UploadParams, queue: FileData[]) => {
  //         const has = queue.some(v => {
  //           return params.name === v.params?.name && params.parentId === v.params?.parentId && ['uploading', 'waiting', 'cancel'].includes(v.status)
  //         })
  //         if (has) {
  //           const msg = '任务已在列表中'
  //           this.$message.warning(msg)
  //           return Promise.reject(new Error(msg))
  //         }
  //         return Promise.resolve()
  //         // return existsName(params.parentId, params.name).then(data => {
  //         //   if (!data) {
  //         //     return Promise.resolve()
  //         //   } else {
  //         //     const msg = '文件名已存在'
  //         //     this.$message.warning(msg)
  //         //     return Promise.reject(new Error(msg))
  //         //   }
  //         // })
  //       },
  //       afterUpload: (params: UploadParams, resp: UploadResp, queue: FileData[]) => {
  //         const req = {
  //           parentId: params.parentId,
  //           name: params.name,
  //           size: params.file?.size,
  //           url: resp.url
  //         }
  //         return upload(req).then(data => {
  //           if (this.load && (this.$route?.query?.id === String(params.parentId) || (!this.$route?.query?.id && params.path.indexOf('/') < 0))) {
  //             this.load()
  //           }
  //           return data
  //         })
  //       }
  //     }
  //     this.$oss.upload(params)
  //   }
  // }
}
</script>

<style lang="scss" module>
@import "~@/styles/vars.scss";

.container {

}

</style>
